<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?>
<div id="rightinfo" class="rightinfo"></div>

<!-- 模板 -->
<script id="list" type="text/html">
    <ul class="seachform">
    <li>        
        <select name="cid" class="selectmenu">
        <%if(category_tree[0]){var first = category_tree[0]; for(var i = 0; i < first.length; i ++) {%>
            <option value="<%=first[i].id%>" <%=first[i].id==cid?'selected="selected"':''%>><%=first[i].title%></option>
            <%if(category_tree[first[i].id]){var second = category_tree[first[i].id]; for(var j = 0; j < second.length; j ++) {%>
                <option value="<%=second[j].id%>" <%=second[j].id==cid?'selected="selected"':''%>>&nbsp;&nbsp;|--&nbsp;&nbsp;<%=second[j].title%></option>
                <%if(category_tree[second[j].id]){var third = category_tree[second[j].id]; for(var k = 0; k < third.length; k ++) {%>
                    <option value="<%=third[k].id%>" <%=third[k].id==cid?'selected="selected"':''%>>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;|--&nbsp;&nbsp;<%=third[k].title%></option>
                <%}}%>
            <%}}%>
        <%}}%>
        </select>
        </div>
    </li>
    <li><input id="keywords" type="text" class="scinput" value="<%=#keywords%>" /></li>
    <li><input name="" type="button" class="scbtn search_ok" value="搜索"/></li>
    <li><input name="" type="button" class="scbtn search_cancel" value="取消"/></li>
    </ul>

    <table class="tablelist">
        <thead>
        <tr>
        <th style="width:8%">编号</th>
        <th>标题</th>
        <th style="width:12%">所属分类</th>
        <th style="width:8%">下载量</th>
        <th style="width:8%">排序</th>
        <th style="width:8%">启用</th>
        <th style="width:16%">添加日期</th>
        <th style="width:15%">操作</th>
        </tr>
        </thead>
        <tbody>
        <%for(i = 0; i < list.length; i ++) {%>
            <tr <%=#(i%2 ==0) ?'':'class="odd"'%> data-id="<%=list[i].id%>">
            <td><%=list[i].id%></td>
            <td>
                <%=list[i].title%>
            </td>
            <td><%=list[i].category%></td>
            <td><%=Number(list[i].clicked)%></td>
            <td><%=Number(list[i].sort)%></td>
            <td><%=#list[i].enable?'是':'<i>否</i>'%></td>
            <td><%=dateFormat(list[i].add_time,'yyyy/MM/dd h:m')%></td>
            <td>
                <a class="tablelink act_edit">编辑</a>
                <a class="tablelink act_delete">删除</a>
                <?php if($is_bilingual){?>
                <a class="tablelink act_edit_en">英文版</a>
                <?php }?>
            </td>
            </tr>
        <%}%>        
        </tbody>
    </table>  
    <div class="pagin">
        <div class="message">共<i class="blue"><%=record_count%></i>条记录，当前显示第&nbsp;<i class="blue"><%=page_num%>/<%=page_count%></i>&nbsp;页</div>
        <div class="paginList" id="page_bar"></div>
    </div>
    <div class="clearfloat"></div>
</script>

<script id="edit" type="text/html">
<form action="<?php echo site_url('ajax/content_handle/modify');?>" method="POST">  
<div class="formtitle"><span><%=id?'编辑':'添加'%>下载</span></div> 
<input name="id" type="hidden" value="<%=id?id:0%>" />
<ul class="forminfo">
    <li>
        <label>所属分类<b>*</b></label>     
        <select name="cid" class="selectmenu">
        <%if(category_tree[0]){var first = category_tree[0]; for(var i = 0; i < first.length; i ++) {%>
            <option value="<%=first[i].id%>" <%=first[i].id==cid?'selected="selected"':''%>><%=first[i].title%></option>
            <%if(category_tree[first[i].id]){var second = category_tree[first[i].id]; for(var j = 0; j < second.length; j ++) {%>
                <option value="<%=second[j].id%>" <%=second[j].id==cid?'selected="selected"':''%>>&nbsp;&nbsp;|--&nbsp;&nbsp;<%=second[j].title%></option>
                <%if(category_tree[second[j].id]){var third = category_tree[second[j].id]; for(var k = 0; k < third.length; k ++) {%>
                    <option value="<%=third[k].id%>" <%=third[k].id==cid?'selected="selected"':''%>>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;|--&nbsp;&nbsp;<%=third[k].title%></option>
                <%}}%>
            <%}}%>
        <%}}%>
        </select>
    </li>
    <li><label>标题<b>*</b></label><input name="title" value="<%=title%>" type="text" class="dfinput" /></li>
    <li style="display:none;">
        <label>封面图片</label>
        <span class="imgshow" id="img_cover">
            <input name="img_cover" value="<%=img_cover%>" type="hidden" />
            <div class="infobox">
                <img src=""/>
                <a>×</a>
            </div>
        </span>
        <a class="file"><span>上传图片</span><input id="up_img_cover" name="up_img_cover" type="file" /></a>
    </li>
    <li>
        <label>文件资源</label>
        <span class="docshow" id="doc">
            <input name="file_description" value="<%=file_description%>" type="hidden" />
            <input name="file_type" value="<%=file_type%>" type="hidden" />
            <input name="file_size" value="<%=file_size%>" type="hidden" />
            <input name="file_path" value="<%=file_path%>" type="hidden" />
            <div class="infobox">
                <img src=""/>
                <span class="doc_title"></span>
                <span class="doc_size"></span>
                <a>×</a>
            </div>
        </span>
        <a class="file"><span>上传文件</span><input id="up_doc" name="up_doc" type="file" /></a>
    </li>
    <li><label>排序</label><input name="sort" value="<%=Number(sort)%>" type="text" class="dfinput" /><i>数值大的在前，数值小的在后</i></li>
    <li><label>SEO标题</label><input name="head_title" value="<%=head_title%>" style="width:480px" type="text" class="dfinput" /><i>title标签</i></li>
    <li><label>SEO关键词</label><input name="head_keywords" value="<%=head_keywords%>" style="width:480px" type="text" class="dfinput" /><i>对应keywords</i></li>
    <li><label>SEO描述</label><textarea name="head_description" style="height:80px" class="textinput"><%=head_description%></textarea><i>对应description</i></li>
    <li><label>标签</label><cite>
        <input name="flag" type="hidden" value="<%=flag%>" />

        <input name="hot" type="hidden"/>
        <input id="hot" type="checkbox" <%=checkFlag(flag,0)?'checked="checked"':''%>/>
        <label for="hot">热门</label>

        <input name="rec" type="hidden"/>
        <input id="rec" type="checkbox" <%=checkFlag(flag,1)?'checked="checked"':''%>/>
        <label for="rec">推荐</label>

        <input name="ad" type="hidden"/>
        <input id="ad" type="checkbox" <%=checkFlag(flag,2)?'checked="checked"':''%>/>
        <label for="ad">广告</label>
    </cite></li>
    <li><label>是否启用</label><cite><input id="enable_yes" name="enable" type="radio" value="1" <%=enable?'checked="checked"':''%>/><label for="enable_yes">是</label><input id="enable_no" name="enable" type="radio" value="0"  <%=enable?'':'checked="checked"'%>/><label for="enable_no">否</label></cite></li>
    <li><label>内容</label><textarea name="content" class="textinput"><%=content%></textarea></li>
    <li><label>&nbsp;</label><input type="submit" class="btn" value="确认保存"/><input type="button" class="btn btn_cancle" value="取消"/></li>
</ul>
</form>
</script>

<script id="edit_en" type="text/html">
<form action="<?php echo site_url('ajax/content_handle/modify');?>" method="POST">  
<div class="formtitle"><span><%=id?'编辑':'添加'%>下载(英文版)</span></div> 
<input name="id" type="hidden" value="<%=id?id:0%>" />
<ul class="forminfo">
    <li><label>标题</label><input name="subtitle" value="<%=subtitle%>" type="text" class="dfinput" /></li>
    <li><label>内容</label><textarea name="en_content" class="textinput"><%=en_content%></textarea></li>
    <li><label>SEO标题</label><input name="en_head_title" value="<%=en_head_title%>" style="width:480px" type="text" class="dfinput" /><i>title标签</i></li>
    <li><label>SEO关键词</label><input name="en_head_keywords" value="<%=en_head_keywords%>" style="width:480px" type="text" class="dfinput" /><i>对应keywords</i></li>
    <li><label>SEO描述</label><textarea name="en_head_description" style="height:80px" class="textinput"><%=en_head_description%></textarea><i>对应description</i></li>
    <li><label>&nbsp;</label><input type="submit" class="btn" value="确认保存"/><input type="button" class="btn btn_cancle" value="取消"/></li>
</ul>
</form>
</script>

<!-- 脚本 -->
<script src="js/template-helper.js" type="text/javascript"></script>
<script type="text/javascript">
function get_page(){
    $.getJSON(
          '<?php echo site_url('ajax/content_handle/get_list');?>',
          {
        	  keywords:current_status.keywords,
      	      gid:current_status.gid,
      	      cid:current_status.cid,
              begin: (current_status.page_num - 1) * current_status.page_size,
              length: current_status.page_size
          },
          function(rs){
              if(rs.err===0){
                current_status.page_count = Math.ceil(rs.data.record_count/current_status.page_size);
                //呈现内容
                $('#rightinfo').html(template('list', $.extend({},current_status,rs.data)));
                //显示下拉框
                $( ".selectmenu" ).selectmenu({width:162, change:function(event, data){
                	current_status.cid = data.item.value;
                	current_status.keywords = '';
                	current_status.page_num = 1;
                	init();
                }});
                //显示分页
                laypage({
                    cont: 'page_bar', //容器。值支持id名、原生dom对象，jquery对象。【如该容器为】：<div id="page1"></div>
                    pages: current_status.page_count, //通过后台拿到的总页数
                    curr: current_status.page_num, //当前页
                    jump: function(obj, is_self){ //触发分页后的回调
                        if(!is_self){ //点击跳页触发函数自身，并传递当前页：obj.curr
                            current_status.page_num = obj.curr;
                            get_page();
                        }
                    }
                });
              }else if(rs.err===4){
                  //数据实际页数减少，但前端没有刷新，仍旧请求不存在的页码，返回的是“列表为空”的错误
                  current_status.page_num --;
                  get_page();
              }else{
                  layer.msg(rs.msg, {icon:2,time:2000});
              }            
        }
    );
};
//初始化
function init(){
    var hash = window.location.hash.split('/');
    if(hash[0]=='#add'){
        //添加准备
    	$('.btn_add').hide();
    	$('.btn_back').show();
    	$.getJSON(
                '<?php echo site_url('ajax/content_handle/prepare_add');?>',
                {
                    gid:current_status.gid
                },
                function(rs){
                    if(rs.err===0){
                    	$('#rightinfo').html(template('edit', $.extend({enable:true,flag:0},current_status,rs.data)));
                    	$( ".selectmenu" ).selectmenu({width: 162});
    	            	$('.imgshow .infobox').hover(function(){
    	            		$(this).find('a').show();
    		            },function(){
    		            	$(this).find('a').hide();
    		            });
    	            	$('.imgshow a').on('click', function(){
    		                $(this).parent().siblings('input').val('');
    		                infoshow($(this).parent().parent());
    	            	});
                    	$('.docshow .infobox').hover(function(){
    	            		$(this).find('a').show();
    		            },function(){
    		            	$(this).find('a').hide();
    		            });
    	            	$('.docshow a').on('click', function(){
    		          	    $(this).parent().siblings('input').val('');
    	                    doc_info_show($(this).parent().parent());
    	            	}); 
                    }else{
                          layer.msg(rs.msg, {icon:2,time:2000});
                    }
                }
        );
    }else if(hash[0]=='#edit' && hash[1]>0){
        //编辑准备
        $('.btn_add').hide();
    	$('.btn_back').show();
    	$.getJSON(
                '<?php echo site_url('ajax/content_handle/get');?>',
                {
                    id:hash[1]
                },
                function(rs){
                    if(rs.err===0){
                    	$('#rightinfo').html(template('edit', rs.data));
                    	$( ".selectmenu" ).selectmenu({width: 162});
    	            	$('.imgshow .infobox').hover(function(){
    	            		$(this).find('a').show();
    		            },function(){
    		            	$(this).find('a').hide();
    		            });
    	            	$('.imgshow a').on('click', function(){
    		                $(this).parent().siblings('input').val('');
    		                infoshow($(this).parent().parent());
    	            	});
    	            	$('.imgshow').each(function(){
    	            		infoshow($(this));
    	            	}); 
                    	$('.docshow .infobox').hover(function(){
    	            		$(this).find('a').show();
    		            },function(){
    		            	$(this).find('a').hide();
    		            });
    	            	$('.docshow a').on('click', function(){
    		          	    $(this).parent().siblings('input').val('');
      		          	    doc_info_show($(this).parent().parent());
    	            	});
    	            	$('.docshow').each(function(){
    	            		doc_info_show($(this));
    	            	});
                    }else{
                          layer.msg(rs.msg, {icon:2,time:2000});
                    }
                }
        );   	   	
    }else if(hash[0]=='#edit_en' && hash[1]>0){
        //编辑准备
        $('.btn_add').hide();
    	$('.btn_back').show();
    	$.getJSON(
                '<?php echo site_url('ajax/content_handle/get');?>',
                {
                    id:hash[1]
                },
                function(rs){
                    if(rs.err===0){
                    	$('#rightinfo').html(template('edit_en', rs.data));
                    }else{
                          layer.msg(rs.msg, {icon:2,time:2000});
                    }
                }
        );   	   	
    }else{
    	$('.btn_add').show();
    	$('.btn_back').hide();
    	get_page();	
    }
}

//添加
$('.btn_add').on('click', function(){
	window.location.hash = 'add';
	init();
});
//返回列表
$('.btn_back').on('click', function(){
	window.location.hash = '';
	init();
});
//取消
$('#rightinfo').on('click', '.btn_cancle', function(){
	window.location.hash = '';
	init();
});
//搜索
$('#rightinfo').on('click', '.search_ok', function(){
	current_status.keywords = $('#keywords').val();
	current_status.page_num = 1;
	init();
});
//取消搜索
$('#rightinfo').on('click', '.search_cancel', function(){
	$('#keywords').val('');
	current_status.keywords = '';
	current_status.page_num = 1;
	init();
});
//删除
$('#rightinfo').on('click', '.act_delete',function(){
    var id = $(this).parent().parent().attr('data-id');
    $.post(
            '<?php echo site_url('ajax/content_handle/modify');?>',
            {
                  id:id,
                  deleted:1
            },
            function(rs){
                if(rs.err===0){
                    layer.msg('删除成功！', {icon:1,time:2000});    
                    get_page();
                }else{
                    layer.msg(rs.msg, {icon:2,time:2000});
                }
            },
            'json'
    );
});
//编辑
$('#rightinfo').on('click', '.act_edit', function(){
	var id = $(this).parent().parent().attr('data-id');    
    window.location.hash = 'edit/'+id;
	init();
});
//英文版编辑
$('#rightinfo').on('click', '.act_edit_en', function(){
	var id = $(this).parent().parent().attr('data-id');    
    window.location.hash = 'edit_en/'+id;
	init();
});
//保存
$('#rightinfo').on('submit','form', function(e) {
    e.preventDefault();
	var this_btn = $(this);
    if(!this_btn.attr('disabled')){
    	this_btn.attr('disabled',true);
    }else{
        return;
    }
    $(this).ajaxSubmit({
    	dataType:'json',
    	beforeSerialize: function($form, options) {
        	$form.find( 'input:checkbox' ).each(function(){
            	$form.find( 'input[name="' + $(this).attr('id') + '"]' ).val( $(this).attr('checked') ? 1 : 0 );
            });
    	},
    	success:function(rs){
    		if(rs.err===0){
                layer.msg('保存成功！', {icon:1,time:2000}, function(){
                    current_status.cid = 0;
            		current_status.keywords = '';
    			    current_status.page_num = 1;
        			window.location.hash = '';
        			init();
                });
            }else{
                layer.msg(rs.msg, {icon:2,time:2000}, function(){
                	this_btn.attr('disabled',false);
                });
            }
		}
    });
});
//上传
$("#rightinfo").on('change', '#up_img_cover', function(){
	$.ajaxFileUpload({
	    url:'<?php echo site_url('ajax/upload_handle/image');?>',
	    fileElementId:'up_img_cover',
	    dataType: 'json',
	    success: function(rs,status){
	        if(rs.err===0){
		        $('#img_cover input').val(rs.data.save);
		        infoshow($('#img_cover'));
	        }else{
	        	layer.msg(rs.msg, {icon:2,time:2000});
	        }
	    }
	});
});
function infoshow($el){
	var src = $el.find('input').val();
	if(src){
		$el.find('img').attr('src','<?php echo up_path();?>' + src);
		$el.find('.infobox').show();
	}else{
		$el.find('.infobox').hide();
	}
}
$("#rightinfo").on('change', '#up_doc', function(){
	var index = layer.load();
    $.ajaxFileUpload({
	    url:'<?php echo site_url('ajax/upload_handle/file');?>',
	    fileElementId:'up_doc',
	    dataType: 'json',
	    success: function(rs,status){
	    	layer.close(index);
            if(rs.err===0){
		        $('#doc input[name="file_description"]').val(rs.data.name);
		        $('#doc input[name="file_type"]').val(rs.data.type);
		        $('#doc input[name="file_size"]').val(rs.data.size);
		        $('#doc input[name="file_path"]').val(rs.data.save);
		        doc_info_show($('#doc'));
	        }else{
	        	layer.msg(rs.msg, {icon:2});
	        }
	    }
	});
});
//显示文件资源
function doc_info_show($el){
	var name = $el.find('input[name="file_description"]').val();
	var type = $el.find('input[name="file_type"]').val();
	var size = $el.find('input[name="file_size"]').val();
	if(name){
		if(size<1024){
			size = size + 'B';
		}else if(size<1048576){
			size = (size/1024).toFixed(2)+'K';
		}else{
			size = (size/1048576).toFixed(2)+'M';
		}
		$el.find('img').attr('src','images/type_' + type + '.png');
		$el.find('.doc_title').html(name);
		$el.find('.doc_size').html(size);
		$el.find('.infobox').show();
	}else{
		$el.find('.infobox').hide();
	}
}

var current_status = { gid:4, cid:0, keywords:'', page_num:1, page_size:20, page_count:1 };
init();
</script>